<template>
    <view class="audio"></view>
</template>
<script>
export default {
    name: 'Audio',
    data() {
        return {
            audioContext: uni.createInnerAudioContext()
        };
    },
    props: {
        src: {
            type: String,
            default: ''
        },
        playStatus: {
            type: Boolean,
            default: false
        },
        isLoop: {
            type: Boolean,
            default: true
        }
    },
    computed: {},
    created() {
        if (this.src) {
            this.audioContext.src = this.src;

        }
        this.audioContext.onPlay(() => {
            this.$emit('play');
        });
        // //音频暂停事件
        this.audioContext.onPause(() => {
            this.$emit('paused');
        });
    },
    methods: {},
    beforeDestroy() {
        this.audioContext.destroy();
    },
    watch: {
        src: {
            handler(newVal, oldVal) {
                console.log(newVal);
                if (newVal) {
                    this.audioContext.src = newVal;
                    this.audioContext.loop = this.isLoop;
                    this.audioContext.play();
                } 
            },
            immediate: true
        },
        playStatus: {
            handler(newVal, oldVal) {
                if (newVal) {
                    this.audioContext.play();
                } else {
                    this.audioContext.pause();
                }
            },
            immediate: true
        }
    },
    components: {}
};
</script>
<style lang="scss"></style>
